<template>
  <div class="visitor">
    <el-form label-width="100px"
             class="demo-ruleForm visitor-ubaonoff-form"
             label-position="top"
             :model="ruleForm"
             ref="ruleForm">
      <div class="title visitor-ubaonoff-title">{{$t('webchat.customerTrackBrowseRemark')}}</div>
      <el-form-item class="visitor-ubaonoff-formitem" :label="$t('configLazyLoad.visitorWaitConfig.tips1')">
        <el-radio-group v-model="ruleForm.ubaOnOff">
          <el-radio label="true">{{$t('public.yes')}}</el-radio>
          <el-radio label="false">{{$t('public.no')}}</el-radio>
        </el-radio-group>
        <div class="tip">{{$t('configLazyLoad.visitorWaitConfig.tips2')}}</div>
      </el-form-item>
      <div class="title">{{$t('configLazyLoad.visitorWaitConfig.saveType')}}</div>
      <el-form-item>
        <el-radio-group v-model="ruleForm.sourcePageMemory">
          <el-radio label="page">{{$t('configLazyLoad.visitorWaitConfig.onlySavePageData')}}</el-radio>
          <el-radio label="url">{{$t('configLazyLoad.visitorWaitConfig.saveAllUrl')}}</el-radio>
        </el-radio-group>
        <div class="tip">
          {{$t('configLazyLoad.webimClient.tip')}}
          <br/><br/>
          {{$t('configLazyLoad.visitorWaitConfig.tips3')}}
          <br/><br/>
          {{$t('configLazyLoad.visitorWaitConfig.tips4')}}
        </div>
      </el-form-item>
      <div class="title">{{$t('configLazyLoad.visitorWaitConfig.technicalSupportSet')}}</div>
      <el-form-item>
        <el-radio-group v-model="ruleForm.showTechSupport">
          <el-radio :label="true">{{$t('public.yes')}}</el-radio>
          <el-radio :label="false">{{$t('public.no')}}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item class="submit">
        <el-button type="primary" @click="submitForm(ruleForm)" class="primary_btn">{{$t('public.save')}}</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
  export default {
    name: 'visitorWaitConfig',
    data () {
      return {
        ruleForm: {
          _id: '',
          ubaOnOff: 'false',
          sourcePageMemory: 'page',
          showTechSupport: false
        }
      }
    },
    components: {
    },
    methods: {
      inti (obj) {
        for (var item in this.ruleForm) {
          this.ruleForm[item] = obj[item] === undefined ? this.ruleForm[item] : obj[item]
        }
        if (this.ruleForm.ubaOnOff !== 'true') {
          this.ruleForm.ubaOnOff = 'false'
        }
        if (!this.ruleForm.sourcePageMemory) {
          this.ruleForm.ubaOnOff = 'page'
        }
        if (!typeof this.ruleForm.showTechSupport) {
          this.ruleForm.showTechSupport = false
        }
      },
      toggleLeaveMsg () {
        this.ruleForm.leavemsgTip = ''
        this.ruleForm.msg = ''
      },
      submitForm (data) {
        this.$refs.ruleForm.validate((valid) => {
          if (valid) {
            this.$store.dispatch('saveVisitorSet', data).then(res => {
              if (res && res.success) {
                this.$message.success(this.$t('configLazyLoad.webimClient.setingSuccess'))
              }
            })
          }
        })
      }
    },
    beforeMount () {
      let data = {}
      this.$store.dispatch('getVisitorData', data).then(res => {
        if (res && res.row) {
          this.inti(res.row)
        }
      })
    }
  }
</script>
<style lang="stylus" scoped>
  @import "../../../../../assets/common.styl"
  .visitor
    .el-form
      width 500px
      .submit
        text-align right
      .el-form-item
        margin-bottom 20px
        .el-input
          color $cf-level3
        p
          font-size 12px
          color $cf-level3
  .tip
    padding-bottom 15px
    color $c-prompt
    font-size 12px
    line-height 1.5
  .title
    font-weight: 900
    font-size: 14px
    margin-bottom: 5px
</style>
